﻿function ForecastModelAnalyse(container, config) {
    this.timepoints = [];
    this.forTime = [];
    this.monitorValue = [];
    this.pollutantName = [];
    this.pubRange = [];
    this.multRange = [];//多元回归模型
    this.bpRange = [];//BP神经网络
    this.clusterRange = [];//聚类回归模型
    this.title = config["title"] || null;
    this.subtitle = config["subtitle"] || null;
    this.height = config["height"] || null;
    this.width = config["width"] || null;
    this.xwidth = config["xwidth"] || 60;
    this.title = config["title"] || "";
    this.container = container;
}

ForecastModelAnalyse.prototype.tooltipFormatter = function (tooltip) {
    var index = tooltip.points[0].point.x;
    var infos = [];
    var pubValue_Low;
    var pubValue_High;
    var monitorValue;
    var ret = '<middle>' + tooltip.x + '</middle><br>';
    ret += '<table>';

    Highcharts.each(tooltip.points, function (point) {
        var series = point.series;
        if (series.name == "多元回归") {
            //infos.push({ name: series.name, color: series.color });
            pubValue_Low = series.yData[index][0];
            pubValue_High = series.yData[index][1];
            ret += '<tr><td><span style="color:' + series.color + '">\u25CF</span> ' + series.name + '：</td><td>' + pubValue_Low + '~' + pubValue_High + '</td></tr>';
        }
        else if (series.name == "BP神经网络") {
            //infos.push({ name: series.name, color: series.color });
            pubValue_Low = series.yData[index][0];
            pubValue_High = series.yData[index][1];
            ret += '<tr><td><span style="color:' + series.color + '">\u25CF</span> ' + series.name + '：</td><td>' + pubValue_Low + '~' + pubValue_High + '</td></tr>';
        }
        else if (series.name == "聚类回归") {
            pubValue_Low = series.yData[index][0];
            pubValue_High = series.yData[index][1];
            ret += '<tr><td><span style="color:' + series.color + '">\u25CF</span> ' + series.name + '：</td><td>' + pubValue_Low + '~' + pubValue_High + '</td></tr>';
        }
        else {
            infos.push({ name: series.name, color: series.color });
            monitorValue = Highcharts.pick(point.point.value, point.y);
            ret += '<tr><td><span style="color:' + series.color + '">\u25CF</span> ' + series.name + '：</td><td>' + monitorValue + '</td></tr>';
        }


    });
    //$.each(infos, function (index, info) {
    //    if (info.name !== "监测值") {
    //        var correctSpan;
    //        if (typeof (monitorValue) == "undefined" || typeof (pubValue_Low) == "undefined") {
    //            correctSpan = "";
    //        }
    //        else if (monitorValue >= pubValue_Low && monitorValue <= pubValue_High) {
    //            correctSpan = "<span class='blue '>(准)</span>";

    //        }
    //        else {
    //            correctSpan = "<span class='red'>(不准)</span>";


    //        }
    //        ret += '<tr><td><span style="color:' + info.color + '">\u25CF</span> ' + info.name + '：</td><td>' + pubValue_Low + '~' + pubValue_High + correctSpan + '</td></tr>';
    //    }
    //    else {
    //        ret += '<tr><td><span style="color:' + info.color + '">\u25CF</span> ' + info.name + '：</td><td>' + monitorValue + '</td></tr>';
    //    }
    //});


    ret += '</table>';

    return ret;

};


ForecastModelAnalyse.prototype.getStep = function () {
    var _ = this,
        width = $("#chartContainer").width(),
        count = _.timepoints.length,
        num = 1,
        xWidth = _.xwidth;
    while (xWidth * count > width) {
        num = num * 2;
        count = count / 2;
    }
    return num;
}

ForecastModelAnalyse.prototype.getChartOptions = function () {
    var _ = this;
    return {
        chart: {
            renderTo: _.container,
            height: _.height,
            width: _.width
        },
        title: {
            text: _.title
        },
        subtitle: {
            text: _.subtitle,
            x: 10
        },
        credits: {
            enabled: false
        },
        xAxis: [{
            categories: _.forTime,
            tickInterval: _.getStep()
        }],
        yAxis: {
            min: 0,
            title: {
                text: null
            },
            labels: {
                style: {
                    fontSize: '10px'
                }
            },
            plotLines: [{
                value: 50,
                color: '#00FF00',
                width: 3,
                label: {
                    text: '一级',
                    align: 'left',
                    style: {
                        color: 'gray'
                    }
                }
            }, {
                value: 100,
                color: '#FFFF00',
                width: 3,
                label: {
                    text: '二级',
                    align: 'left',
                    style: {
                        color: 'gray'
                    }
                }
            }, {
                value: 150,
                color: '#FF7E00',
                width: 3,
                label: {
                    text: '三级',
                    align: 'left',
                    style: {
                        color: 'gray'
                    }
                }
            }, {
                value: 200,
                color: '#FF0000',
                width: 3,
                label: {
                    text: '四级',
                    align: 'left',
                    style: {
                        color: 'gray'
                    }
                }
            }, {
                value: 300,
                color: '#99004C',
                width: 3,
                label: {
                    text: '五级',
                    align: 'left',
                    style: {
                        color: 'gray'
                    }
                }
            }]
        },
        tooltip: {
            shared: true,
            crosshairs: true,
            useHTML: true,
            formatter: function () {
                return _.tooltipFormatter(this);
            }
        },
        series: [{
            name: "监测值",
            type: 'spline',
            color: '#434348',
            data: _.monitorValue,
            zIndex: 1
        }, {
            name: '多元回归',
            type: 'arearange',
            color: '#1396DE',
            data: _.multRange
        }, {
            name: 'BP神经网络',
            type: 'arearange',
            color: '#F1D621',
            data: _.bpRange
        }, {
            name: '聚类回归',
            type: 'arearange',
            color: '#00FFDD',
            data: _.clusterRange
        }]
    }
};


ForecastModelAnalyse.prototype.createChart = function () {
    var _ = this;
    this.chart = new Highcharts.Chart(_.getChartOptions());

    this.chart.series[0].select();
};

ForecastModelAnalyse.prototype.initData = function (jsonData,pollutantName) {
    var _ = this;
    var Lowname = pollutantName + "Low";
    var Highname = pollutantName + "High";
    if (jsonData.length > 0) {
        var d = jsonData;
        for (var i = 0; i < jsonData.length; i++) {
            if (d[i].ForecastModelName=="监测数据") {
                _.monitorValue.push(d[i][pollutantName]);
                _.timepoints.push(d[i].ForTime);
                _.forTime.push(d[i].ForTime);
               
            }
            if (d[i].ForecastModelName == "多元回归模型") {
                _.multRange.push([d[i][Lowname], d[i][Highname]]);
            }
            if (d[i].ForecastModelName == "BP神经网络") {
                _.bpRange.push([d[i][Lowname], d[i][Highname]]);
            }
            if (d[i].ForecastModelName == "聚类回归模型") {
                _.clusterRange.push([d[i][Lowname], d[i][Highname]]);
            }
            //_.forTime.push(formatDate(GetTimeFromJsonString(d[i].ForTime), "MM月DD日"));
            //_.monitorValue.push(d[i].MonitorValue);
            //_.pollutantName.push(d[i].PollutantName);
           
            //_.pubRange.push([d[i].LowValue, d[i].HighValue]);
        }
        _.createChart();
    }
    else {
        return "no data";
    }
};




